<template>
    <view class="pagebox">
        <uni-search-bar bgColor="#fff" 
        placeholder="项目名称/收货地址/联系人"
        @confirm="search"  v-model="keyword"
        @cancel="scancelearch" @clear="search"></uni-search-bar>
        
        
        <uni-card v-for="(item,index) in lists" :is-shadow="true" 
        @click.native="$navto('/pages/kehu/orderdetails?oid='+item.id)">
            <view class="list">
                <view class="title">门店：</view>
                <view class="content">
                    {{item.client.shop_name}}
                </view>
            </view>
            <view class="list">
                <view class="title">项目编号：</view>
                <view class="content">{{item.order_sn}}</view>
            </view>
            <view class="list">
                <view class="title">项目名称：</view>
                <view class="content">{{item.project_name}}</view>
            </view>
            <view class="list">
                <view class="title">形象：</view>
                <view class="content">{{item.image}}</view>
            </view>
                
            <view class="list">
                <view class="title">下单日期：</view>
                <view class="content">{{item.update_time}}</view>
            </view>
            <view class="list">
                <view class="title">生产进度：</view>
                <view class="content" style="color: #18bc37;">{{item.total_progress}}%</view>
            </view>
            <view class="list">
                <view class="title">发货情况：</view>
                <view class="content" style="color: #409EFF;">{{item.send_status==2?'已发货':'未发货'}}</view>
            </view>
            <view class="list btnbox">
                <view class="title"></view>
                <view class="content">
                    <text class="btns">查看详情</text>
                </view>
            </view>
        </uni-card>
       
        <view class="more">
            <template v-if="page<last_page">
                加载更多~
            </template>    
            <template v-else>
                没有更多了~
            </template>
        </view>
    </view>
</template>

<script>
    export default {
      name:"orderlist",  
      data() {
        return {
          lists:[],
          page:1,
          last_page:1,
          status:'',
          keyword:'', 
          constants: {},
          type:''
        };
      },
      onPullDownRefresh(){
          this.page = 1
          this.lists = []
          var _this = this
          setTimeout(function () {
              uni.stopPullDownRefresh();
              _this.getlists()
          }, 500);
      },
      onReachBottom(){
          if(this.page<this.last_page){
              this.page ++ 
              this.getlists()
          }
      },
      onLoad(option){
          if(option.type){
              this.type = option.type
          }
          this.search()
      },
      onShow(){
      },
      methods: {
          scancelearch(){
              this.keyword = ''
              this.search()
          },
          
          search(){
              this.page = 1
              this.lists = []
              this.getlists()
          },
          getlists(){
              this.$api.get(`order/orderlist?typec=${this.type}&keyword=${this.keyword}&page=${this.page}`).then(({data})=>{
                  this.last_page = data.last_page
                  this.lists = this.lists.concat(data.data)
              })
          },
      },
    };
</script>

<style lang="less">
    .list{
        display:flex;
        align-items: center;
        .title{
            width: 30%;
            text-align: right;
            font-weight: bold;
        }
        .content{
            width: 70%;
            text-align: right;
        }
    }
    .btnbox{
        margin-top: 30rpx;
        .btns{
            padding: 10rpx 20rpx;
            color: #fff;
            font-size: 24rpx;
            background-color: #409EFF;
            border-radius: 5rpx;
        }
    }
    
</style>